<!DOCTYPE html>
<html>

<head>
<title>班级网站</title>
<meta charset="UTF-8">
<script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>
<script type="text/javascript"
	src="bootstrap-3.3.7-dist/js/bootstrap.js"></script>
<link rel="stylesheet" href="bootstrap-3.3.7-dist/css/bootstrap.css" />
<link rel="stylesheet" href="css/base.css" />
<script src="https://cdn.staticfile.org/vue/2.4.2/vue.min.js"></script>
<script src="https://cdn.staticfile.org/axios/0.18.0/axios.min.js"></script>

<style>
			pre {
				/*text-indent: .2rem;*/
				background-color: #FFFFFF;
				font-size: 18px;
				white-space: pre-line;
				border: none;
			}
		</style>
</head>
	<body style="background-color: rgb(239, 239, 239);">
	<div id="app">
		<header>
			<div style="width: 1000px; margin: auto;">
				<nav class="navbar navbar-inverse navbar-fixed-top">
					<div id="navbar" class="container">
						<div class="row">
							<div class="col-md-offset-4 col-md-5">
								<ul class="nav navbar-nav ">
									<li role="presentation"><a href="index.html">首页</a></li>
									<li role="presentation"><a href="classNews.html?page=classnews">班级新闻</a>
									</li>
									<li role="presentation"><a href="album.html">班级相册</a></li>
									<li role="presentation"><a href="classMembers.html">班级成员</a>
									</li>
								</ul>
							</div>
							<div class="col-md-3" id="user_box">
								<a href="personalCenter.html">个人中心</a>
							</div>
						</div>

					</div>
				</nav>
			</div>
		</header>
	
		<div class="container" style="margin-top:90px;">
			<div class="row">
				<div class="col-sm-3 col-md-3 l_box" style="padding: 0px;">
					
					<div id="homework">
						<div class="row">
							<div>
								<h3 style="text-align: center; letter-spacing: 9px;">课程表</h3>
							</div>

						</div>
						<hr />
						<img src="img/class_schedule.png" width="100%" height="355px" />
					</div>
				</div>
							<div v-for="(item,index) in list.announce" v-if="index < 5">
								<a :href="'article.html?id='+item.annold+'&page=announce'">
									<li><span>[12/4]</span>{{item.atitle}}</li>
								</a>
							</div>
				<div class="col-sm-9 col-md-9" >
					<div id="article" style="background-color: #fff;" v-if="flag==1">
						<div style="text-align: center; ">
							<h3>{{list.announce.atitle}}</h3>
							<span style="font-size: 16px;">发布时间：{{list.announce.aDate}}</span>
						</div>

						<article>
							<pre>
							{{list.announce.aContent}}
							</pre>
						</article>
					</div>
					<div id="article" style="background-color: #fff;" v-if="flag==2">
						<div style="text-align: center; ">
							<h3>{{list.homework.hTitle}}</h3>
							<span style="font-size: 16px;">发布时间：{{list.homework.hbegin_date}}</span>
							<span style="font-size: 16px;">---截止时间：{{list.homework.hend_date}}</span>
						</div>

						<article>
							<pre>
							{{list.homework.hcontent}}
							</pre>
						</article>
					</div>
					<div id="article" style="background-color: #fff;" v-if="flag==3">
						<div style="text-align: center; ">
							<h3>{{list.schoolnews.cNTile}}</h3>
							<span style="font-size: 16px;">发布时间：{{list.schoolnews.cNTime}}</span>
						</div>

						<article>
							<pre>
							{{list.schoolnews.cNContent}}
							</pre>
						</article>
					</div>
				</div>

			</div>
		</div>
		<br />
	
	</div>
	<script type="text/javascript">
			new Vue({
				el: '#app',
				data() {
					return {
						list:[],
						flag:0
					}
				},
				mounted() {
					var url=window.location.search;
					if(url.indexOf("?")!=-1){
					var str = url.substr(1);
					   strs = str.split("&"); 
					   var key=new Array(strs.length);
					   var value=new Array(strs.length);
					   for(i=0;i<strs.length;i++){
					    key[i]=strs[i].split("=")[0]
					    value[i]=unescape(strs[i].split("=")[1]); 
					  //  alert(key[i]+"="+value[i]);
					  } 
					   var result = value[1];
					   if(result == "announce"){
							this.flag=1;
						}
						else if(result == "homework"){
							this.flag=2;
						}
						else if(result == "classnews"){
							this.flag=3;
						}
					axios.get('../ArticleServlet',{
						params: {  
							id : value[0],
							page : value[1]
						    }
					})
						.then(response => (
								this.list=response.data
								))
						.catch(function(error) { // 请求失败处理
							console.log(error);
						});
					}
				}
			
			})
		</script>
	</body>

</html>